import { Redirect, Route, Switch } from 'react-router-dom';
import './index.css';
// import IndexView from './views/IndexView';
import ListView from './views/ListView';
import UndefinedView from './views/Undefined';

import data from "./data/data";
let allData = [];
let types = ["all"]
Object.keys(data).forEach(key => {
  allData.push(...data[key])
  types.push(key)
})

//console.log(types)

function App() {
  return (
    <div className="wrap">
      <Switch>
        <Route path="/" exact render={() => {
          return <Redirect to="/list"></Redirect>
        }}></Route>
        <Route path="/list/:type?/:page?" render={(props) => {
          const { type = "all", page = "1" } = props.match.params;
          //console.log(type)
          if (types.includes(type) && Number(page) > 0 && String(parseInt(page)) === page) {
            return <ListView data={data} allData={allData} />
          } else {
            return <Redirect to="/404"></Redirect>
          }
        }} ></Route>
        <Route path="/404" component={UndefinedView} ></Route>
        <Redirect to="/404"></Redirect>
      </Switch>
    </div>
  );
}

export default App;
